/*
 * @Author: xiaosihan 
 * @Date: 2023-12-14 16:35:29 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2024-10-31 02:13:29
 */


import NumberJump from "@components/NumberJump/NumberJump";
import utils from "@utils";
import { autorun, toJS } from "mobx";
import { ReactNode, useEffect, useRef, useState } from "react";
import threeUtils from "three-base/threeUtils";
import styles from "./smallAmountRepeatConsumption.module.less";
import doubtfulSituationStore from "@views/DoubtfulSituation/doubtfulSituationStore";
import centerTopStore from "../centerTopStore";

interface Iprops {
    children?: ReactNode
}

// 门诊小额个账连续划卡
export default function SmallAmountRepeatConsumption(props: Iprops) {

    const [data, setData] = useState(toJS(doubtfulSituationStore.regulatory_model_List));
    const [active, setActive] = useState(centerTopStore.active1);

    useEffect(() => autorun(() => {
        setActive(centerTopStore.active1);
        setData(toJS(doubtfulSituationStore.regulatory_model_List));
    }, { delay: 10 }), []);

    // useEffect(() => {
    //     const interval = (param: any) => {
    //         if ((param.accumulate % 100) === 0) {
    //             index.current = (data.length + index.current + 1) % data.length;
    //             setActive(index.current);
    //         }
    //     }
    //     threeUtils.addEventListener("requestAnimationFrame", interval);
    //     return () => threeUtils.removeEventListener("requestAnimationFrame", interval);
    // }, []);

    return (
        <div className={styles.smallAmountRepeatConsumption} >
            <div className={styles.title} >
                {data[active].model_name}
            </div>
            <div className={styles.inline} >
                风险机构数
                <NumberJump
                    fontSize={18}
                    value={utils.numToUnit(data[active].org_cnt).value}
                />
                {utils.numToUnit(data[active].org_cnt).unit}家
            </div>

            <div className={styles.inline} >
                风险人员数
                <NumberJump
                    fontSize={18}
                    value={utils.numToUnit(data[active].psn_cnt).value}
                />
                {utils.numToUnit(data[active].psn_cnt).unit}人
            </div>

            <div className={styles.inline} >
                线索
                <NumberJump
                    fontSize={18}
                    value={utils.numToUnit(data[active].sum_cnt).value}
                />
                {utils.numToUnit(data[active].sum_cnt).unit}条
            </div>

        </div>
    );

}